<template>
  <div class="skeleton-image">
    <el-skeleton animated :loading="loading">
      <template #template>
        <el-skeleton-item variant="image" style="width: 100%; height: 550px" />
      </template>
      <slot></slot>
    </el-skeleton>
  </div>
</template>

<script setup>
const props = defineProps({
  loading: Boolean
});
const loading = computed(() => props.loading);
</script>

<style scoped>
.skeleton-image {
    height: 550px;
    width: 434px;
}
.skeleton-image img {
    display: block;
    height: 550px;
    width: 434px;
}
</style>
